<!-- 项目策划任务表 详情 -->
<template>
  <base-breadcrumb :title="$route.meta.title">
    <a-spin :spinning="spinning">
      <a-row :gutter="10">
        <a-col :span="24">
          <a-form-model
            ref="RuleForm"
            :model="form"
            :label-col="labelCol"
            :wrapper-col="wrapperCol"
            :rules="rules"
          >
            <a-card
              :body-style="{ padding: '24px 32px' }"
              :bordered="false"
            >
              <a-tabs
                :activeKey="key"
                @tabClick="tabClick"
              >
                <a-tab-pane
                  :key="1"
                  tab="项目基本情况"
                >
                  <BaseInfo
                    :form="form"
                    :pageType="pageType"
                  ></BaseInfo>
                  <ProjectPlanningBasis
                    :pageType="pageType"
                    :form="form"
                    ref="ProjectPlanningBasis"
                  ></ProjectPlanningBasis>
                  <div class="tool-btns">
                    <a-button
                      class="mt20"
                      type="primary"
                      @click="nextHandler"
                    > 下一步 </a-button>
                  </div>
                </a-tab-pane>
                <a-tab-pane
                  :key="2"
                  tab="策划工作安排"
                  force-render
                >
                  <PlanningWorkArrangement
                    :pageType="pageType"
                    :editModel="editModel"
                    :form="form"
                    @prevHandler='prevHandler'
                    ref="PlanningWorkArrangement"
                  ></PlanningWorkArrangement>
                  <div class="tool-btns">
                    <a-button
                      class="mt20"
                      type="primary"
                      @click="key = 1"
                    > 上一步 </a-button>
                  </div>
                </a-tab-pane>
              </a-tabs>
            </a-card>
            <div class="tool-btns page-btn-right-top">
              <template v-if="pageType === 'update'">
                <a-button
                  class="ml20"
                  :loading="loading"
                  type="primary"
                  @click="sumbit('SaveDrafts')"
                > 保存草稿 </a-button>
                <a-button
                  class="ml20"
                  :loading="loading"
                  type="primary"
                  @click="sumbit('Submit')"
                > 提交 </a-button>
              </template>
              <a-button
                class="ml20"
                type="primary"
                @click="$close()"
              > 关闭 </a-button>
            </div>
          </a-form-model>
        </a-col>
      </a-row>
    </a-spin>
  </base-breadcrumb>
</template>

<script>
import Vue from 'vue'
import BaseInfo from './components/BaseInfo'
import ProjectPlanningBasis from './components/ProjectPlanningBasis'
import PlanningWorkArrangement from './components/PlanningWorkArrangement'
import { getPlanTaskById, updateByPrimaryKeySelective } from '@/api/projectManagementPlanning/projectPlanningTaskList'
export default {
  name: 'projectPlanningTaskListDetail',
  data() {
    return {
      form: {},
      key: 1,
      spinning: false,
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      loading: false,
      itemId: '',
      pageType: '',
      editModel: false,
      rules: {
        basicInfo: [{ required: true, message: '请输入项目基本情况', trigger: 'blur' }]
      }
    }
  },

  components: { BaseInfo, ProjectPlanningBasis, PlanningWorkArrangement },

  computed: {},

  created() {
    this.itemId = this.$route.query.id
    this.pageType = this.$route.query.pageType
    this.editModel = this.$route.query.editModel
    this.itemId && this.getPlanTaskById()
  },

  mounted() {},

  methods: {
    // 获取详情
    getPlanTaskById() {
      this.spinning = true
      getPlanTaskById({ id: this.itemId })
        .then((res) => {
          this.spinning = false
          res.data.workVOList.map((v) => {
            if (!v.projectOperatorId) {
              v.projectOperatorId = undefined
            }
          })
          if (!res.data.modifiedTime) {
            res.data.modifiedTime = this.moment().format('YYYY-MM-DD')
            res.data.modifiedName = Vue.getAcloudProvider().getUserInfo().name
          }
          this.form = res.data
        })
        .catch(() => {
          this.spinning = false
        })
    },
    tabClick(val) {
      if (val === 2) {
        this.nextHandler()
      } else {
        this.key = 1
      }
    },
    prevHandler() {
      this.key = 1
    },
    verification() {
      const emtyArr = this.$refs.ProjectPlanningBasis.dataSource.filter((v) => (v.preProjectWork ?? '') === '' || (v.finishTime ?? '') === '' || (v.contactName ?? '') === '' || (v.contactPhone ?? '') === '')
      if (emtyArr.length) {
        this.$warning({
          title: '提示',
          content: '请将数据填写完整',
          okText: '确定'
        })
        return false
      } else {
        return true
      }
    },
    nextHandler() {
      if (this.pageType === 'look') {
        this.key = 2
      } else if (this.form.oneSheetStatus == 1) {
        // oneSheetStatus：01表审批状态（1：审批不通过） 如果这个字段=1，就不能点策划工作安排这个页面去
        return
      } else {
        this.$refs.RuleForm.validate((valid) => {
          if(!valid) {
            this.$message.warning("请填写完所有必填项信息")
            return
          }
          valid && this.verification() && (this.key = 2)
        })
      }
    },
    submitHandler() {
      this.loading = true
      const tempObj = { ...this.form }
      tempObj.rationaleDTOList = this.$refs.ProjectPlanningBasis.dataSource
      tempObj.workDTOList = this.$refs.PlanningWorkArrangement.dataSourceWork
      delete tempObj.rationaleVOList
      delete tempObj.workVOList
      updateByPrimaryKeySelective(tempObj)
        .then((res) => {
          this.loading = false
          this.$message.success('保存成功')
          this.$close()
        })
        .catch(() => {
          this.loading = false
        })
    },
    sumbit(type) {
      if (type === 'Submit') {
        this.$refs.RuleForm.validate((valid) => {
          if(!valid) {
            this.$message.warning("请填写完所有必填项信息")
            return
          }
          if (valid && this.verification()) {
            const emtyArr = this.$refs.PlanningWorkArrangement.dataSourceWork.filter((v) => (v.deadline ?? '') === '' || (v.projectOperatorId ?? '') === '')
            if (emtyArr.length) {
              this.$warning({
                title: '提示',
                content: '请将数据填写完整'
              })
              // this.$message.warning('请将数据填写完整')
              return false
            } else {
              this.form.status = 1
              this.$confirm({
                title: '提交',
                content: '请确认是否要提交，提交后不可修改',
                onOk: async () => {
                  this.submitHandler()
                }
              })
            }
          } else {
            this.$message.warning("请填写完所有必填项信息")
          }
        })
      } else {
        this.form.status = 0
        this.submitHandler()
      }
    }
  }
}
</script>
<style lang='less' scoped>
</style>
